<template>
	<view class="contain">
		<view v-if="!show" style="height: 65vh;">
			<image class="w100" src="@/static/images/top_bg.png" mode="widthFix"></image>
		</view>
		<view  class="p-r padding-lr20" >
			
			<view v-if="!show" class="bg-color-w b-radius-12 padding-20">
				<view class="flex  f-j-s">
					<view class="flex f-c f-a-c f-j-c">
						<image class="w-48" src="@/static/images/gaoqing.png" mode="widthFix"></image>
						<text class="margin-t4">高清</text>
					</view>
					<view class="flex f-c f-a-c f-j-c">
						<image class="w-48" src="@/static/images/zhenglian.png" mode="widthFix"></image>
						<text class="margin-t4">正脸</text>
					</view>
					<view class="flex f-c f-a-c f-j-c">
						<image class="w-48" src="@/static/images/guangxian.png" mode="widthFix"></image>
						<text class="margin-t4">光线充足</text>
					</view>
				</view>
				<view @click="submit()" class="flex f-a-c f-j-c b-radius-30 bg-color-linear-b t-color-w h-40 f16-size f-w-500 margin-t16">立即体验</view>
				<view @click="submit()" class="flex f-a-c f-j-c b-radius-30 b-color-b t-color-b h-40 f16-size f-w-500 margin-t16">查看我的报告</view>
			</view>	
			
			<view class="bg-color-w b-radius-12 padding-20 margin-t20">
				<view class="flex f-a-c f-j-c">
					<image class="w-24 margin-r8" src="@/static/images/face_sl.png" mode="widthFix"></image>
					<text class="f18-size f-w-b">{{show ? '基础检测' :'检测报告样例'}}</text>
				</view>
				
				<view class="bg-color-b b-radius-12 padding-tb12 grid grid-c-2 margin-t16">
					<view class="flex f-c f-a-c f-j-c">
						<text class="f26-size f-w-b t-color-b">{{info.beauty}}</text>
						<text class=" f-w-b t-color-c">颜值分</text>
					</view>
					<view class="flex f-c f-a-c f-j-c line-l ">
						<text class="f26-size f-w-b t-color-b">{{info.skin_age.value}}</text>
						<text class=" f-w-b t-color-c">肤龄</text>
					</view>
				</view>
				
				<view class="margin-t20 flex">
					<view class="flex f-c flex-1">
						<view class="img-tl flex f-c f-j-c flex-1">
							<text class="f12-size t-color-c">性别</text>
							<view class="flex f-a-c">
								<image class="w-16 margin-r2" src="@/static/images/w_icon.png" mode="widthFix"></image>
								<text class="f-w-500">{{info.gender}}</text>
							</view>
						</view>
						<view class="img-tl img-bl flex f-c f-j-c flex-1 margin-t12">
							<text class="f12-size t-color-c">年龄</text>
							<view class="flex f-a-c">
								<text class="f-w-500">{{info.age}}</text>
							</view>
						</view>
					</view>
					<view class="flex padding-lr12">
						<view class="img-line over-h">
							<image class="w100 h100" :src="info.image" mode="aspectFill"></image>
						</view>
					</view>
					<view class="flex f-c flex-1">
						<view class="img-tl img-tr flex f-c f-j-c flex-1">
							<text class="f12-size t-color-c">情绪</text>
							<view class="flex f-a-c">
								<text class="f-w-500">{{info.emotion}}</text>
							</view>
						</view>
						<view class="img-tl img-br flex f-c f-j-c flex-1 margin-t12">
							<text class="f12-size t-color-c">脸部健康</text>
							<view class="flex f-a-c">
								<text class="f-w-500">{{info.health}}</text>
							</view>
						</view>
					</view>
				</view>
				<block  v-if="!isAuth">
					<button v-if="has_auth" @authorizeprivatemessage="eventHandler" open-type="authorizePrivateMessage" :data-aweme-id="dyId">
						<view  class="flex f-a-c f-j-c b-radius-30 bg-color-linear-b t-color-w h-40 f16-size f-w-500 margin-t16">1V1解读报告</view>
					</button>
					<view v-else @click="openAuth" class="flex f-a-c f-j-c b-radius-30 bg-color-linear-b t-color-w h-40 f16-size f-w-500 margin-t16">1V1解读报告</view>
				</block>
				
				<button v-else @pm="pmCallback" @error="pmError" open-type="privateMessage" :data-aweme-id="dyId">
					<view  class="flex f-a-c f-j-c b-radius-30 bg-color-linear-b t-color-w h-40 f16-size f-w-500 margin-t16">1V1解读报告</view>
				</button>
				
			</view>	
			
			
			<view class="bg-color-w b-radius-12 padding-20 margin-t20">
				<view class="flex f-a-c f-j-c">
					<image class="w-24 margin-r8" src="@/static/images/face_icon.png" mode="widthFix"></image>
					<text class="f18-size f-w-b">面部特征分析</text>
				</view>
				
				<view class="flex f-a-c f-j-s margin-t16">
					<view class="flex f-a-c">
						<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
						<text class="f16-size f-w-b">三庭</text>
					</view>
					<view @click="showAdvice('三庭',info.three_parts.notice)" class="flex f-a-c">
						<text class="t-color-c f-w-500">查看建议</text>
						<image class="w-20 " src="@/static/images/right_icon.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="flex f-j-c margin-t15">
					<view class="face-line flex f-a-c f-j-c">
						<image class="w-100" src="@/static/images/santing.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="flex f-a-c f-j-s margin-t16">
					<text class="f16-size f-w-b">三庭比例</text>
					<text class="f16-size f-w-b t-color-b">{{info.three_parts.parts_ratio}}</text>
				</view>
				<view class="bg-color-b b-radius-12 padding-tb12 grid grid-c-3 margin-t16">
					<view class="flex f-c f-a-c f-j-c">
						<text class="f16-size f-w-b t-color-b">{{info.three_parts.one_part.faceup_result | sub(2)}}</text>
						<text class="margin-t6 f-w-b t-color-c">上庭</text>
					</view>
					<view class="flex f-c f-a-c f-j-c line-l line-r">
						<text class="f16-size f-w-b t-color-b">{{info.three_parts.two_part.facemid_result | sub(2)}}</text>
						<text class="margin-t6 f-w-b t-color-c">中庭</text>
					</view>
					<view class="flex f-c f-a-c f-j-c">
						<text class="f16-size f-w-b t-color-b">{{info.three_parts.three_part.facedown_result | sub(2)}}</text>
						<text class="margin-t6 f-w-b t-color-c">下庭</text>
					</view>
				</view>
				<view class="padding-tb6 b-bottom-b">
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">上庭长度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.three_parts.one_part.faceup_length}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">上庭占比</text>
						<text class="f-w-b flex f-s-0">{{info.three_parts.one_part.faceup_ratio}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">中庭长度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.three_parts.two_part.facemid_length}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">中庭占比</text>
						<text class="f-w-b flex f-s-0">{{info.three_parts.two_part.facemid_ratio}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">下庭长度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.three_parts.three_part.facedown_length}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">下庭占比</text>
						<text class="f-w-b flex f-s-0">{{info.three_parts.three_part.facedown_ratio}}</text>
					</view>
					
					<view class="padding-6"></view>
				</view>
				
				
				<view class="flex f-a-c f-j-s margin-t16">
					<view class="flex f-a-c">
						<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
						<text class="f16-size f-w-b">五眼</text>
					</view>
					<view @click="showAdvice('五眼',info.five_eyes.notice)" class="flex f-a-c">
						<text class="t-color-c f-w-500">查看建议</text>
						<image class="w-20 " src="@/static/images/right_icon.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="flex f-j-c margin-t15">
					<view class="face-line flex f-a-c f-j-c">
						<image class="w-100" src="@/static/images/wuyan.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="flex f-a-c f-j-s margin-t16">
					<text class="f16-size f-w-b">五眼比例</text>
					<text class="f16-size f-w-b t-color-b">{{info.five_eyes.eyes_ratio}}</text>
				</view>
				<view class="bg-color-b b-radius-12 padding-tb12 grid grid-c-3 margin-t16">
					<view class="flex f-c f-a-c f-j-c">
						<text class="f16-size f-w-b t-color-b">{{info.five_eyes.one_eye.righteye_empty_result | sub(4)}}</text>
						<text class="margin-t6 f-w-b t-color-c">右眼外侧</text>
					</view>
					<view class="flex f-c f-a-c f-j-c line-l line-r">
						<text class="f16-size f-w-b t-color-b">{{info.five_eyes.three_eye.eyein_result | sub(5)}}</text>
						<text class="margin-t6 f-w-b t-color-c">内眼角间距</text>
					</view>
					<view class="flex f-c f-a-c f-j-c">
						<text class="f16-size f-w-b t-color-b">{{info.five_eyes.five_eye.lefteye_empty_result | sub(4)}}</text>
						<text class="margin-t6 f-w-b t-color-c">左外外侧</text>
					</view>
				</view>
				<view class="padding-tb6 b-bottom-b">
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">右眼外侧留白距离 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.five_eyes.righteye}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">右眼外侧留白占比</text>
						<text class="f-w-b flex f-s-0">{{info.five_eyes.one_eye.righteye_empty_ratio}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">右眼宽度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.five_eyes.one_eye.righteye_empty_length}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">内眼角间距 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.five_eyes.three_eye.eyein_length}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">内眼角占比</text>
						<text class="f-w-b flex f-s-0">{{info.five_eyes.three_eye.eyein_ratio}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">左眼宽度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.five_eyes.five_eye.lefteye_empty_length}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">左眼外侧留白距离 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.five_eyes.lefteye}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">左眼外侧留白占比</text>
						<text class="f-w-b flex f-s-0">{{info.five_eyes.five_eye.lefteye_empty_ratio}}</text>
					</view>
					<view class="padding-6"></view>
				</view>
				
				<view class="flex f-a-c f-j-s margin-t16">
					<view class="flex f-a-c">
						<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
						<text class="f16-size f-w-b">脸部</text>
					</view>
					<view @click="showAdvice('脸部',info.face.notice)" class="flex f-a-c">
						<text class="t-color-c f-w-500">查看建议</text>
						<image class="w-20 " src="@/static/images/right_icon.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="flex f-j-c margin-t15">
					<view class="face-line flex f-a-c f-j-c">
						<image class="w-100" src="@/static/images/lianbu.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="flex f-a-c f-j-s margin-t16">
					<text class="f16-size f-w-b">颞部:颧骨:下颌角</text>
					<text class="f16-size f-w-b t-color-b">{{info.face.ABD_ratio}}</text>
				</view>
				<view class="bg-color-b b-radius-12 padding-tb12 margin-t16">
					<view class="flex f-c f-a-c f-j-c">
						<text class="f16-size f-w-b t-color-b">{{info.face.face_type}}</text>
						<text class="margin-t6 f-w-b t-color-c">脸型判断</text>
					</view>
				</view>
				<view class="padding-tb6 b-bottom-b">
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">脸部长度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.face.face_length}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">颞部宽度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.face.tempus_length}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">歡骨宽度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.face.zygoma_length}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">下颌角宽度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.face.mandible_length}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">下颌角度数 (单位°)</text>
						<text class="f-w-b flex f-s-0">{{info.face.E}}</text>
					</view>
					<view class="padding-6"></view>
				</view>
				<view class="flex f-a-c f-j-s margin-t16">
					<view class="flex f-a-c">
						<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
						<text class="f16-size f-w-b">黄金三角</text>
					</view>
				</view>
				<view class="flex f-j-c margin-t15">
					<view class="face-line flex f-a-c f-j-c">
						<image class="w-100" src="@/static/images/sanjiao.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="flex f-a-c f-j-s margin-t16">
					<text class="f16-size f-w-b">黄金三角度数(单位：°)</text>
					<text class="f16-size f-w-b t-color-b">{{info.golden_triangle}}</text>
				</view>
				
				<view class="flex f-a-c f-j-s margin-t16">
					<view class="flex f-a-c">
						<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
						<text class="f16-size f-w-b">眉毛</text>
					</view>
					<view @click="showAdvice(info.eyebrow.eyebrow_type,info.eyebrow.notice)" class="flex f-a-c">
						<text class="t-color-c f-w-500">查看建议</text>
						<image class="w-20 " src="@/static/images/right_icon.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="flex f-j-c margin-t15">
					<view class="face-line flex f-a-c f-j-c">
						<image class="w-100" src="@/static/images/meimao.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="bg-color-b b-radius-12 padding-tb12   margin-t16">
					<view class="flex f-c f-a-c f-j-c">
						<text class="f16-size f-w-b t-color-b">{{info.eyebrow.eyebrow_type}}</text>
						<text class="margin-t6 f-w-b t-color-c">眉型判断</text>
					</view>
				</view>
				<view class="padding-tb6 b-bottom-b">
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">眉毛高度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.eyebrow.brow_height}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">眉毛宽度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.eyebrow.brow_width}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">眉毛粗细 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.eyebrow.brow_thick}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">眉毛挑度 (单位°)</text>
						<text class="f-w-b flex f-s-0">{{info.eyebrow.brow_uptrend_angle}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">眉毛弯度 (单位°)</text>
						<text class="f-w-b flex f-s-0">{{info.eyebrow.brow_camber_angle}}</text>
					</view>
					<view class="padding-6"></view>
				</view>
				
				
				<view class="flex f-a-c f-j-s margin-t16">
					<view class="flex f-a-c">
						<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
						<text class="f16-size f-w-b">眼睛</text>
					</view>
					<view @click="showAdvice(info.eyes.eyes_type,info.eyes.notice)" class="flex f-a-c">
						<text class="t-color-c f-w-500">查看建议</text>
						<image class="w-20 " src="@/static/images/right_icon.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="flex f-j-c margin-t15">
					<view class="face-line flex f-a-c f-j-c">
						<image class="w-100" src="@/static/images/yanjing.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="bg-color-b b-radius-12 padding-tb12   margin-t16">
					<view class="flex f-c f-a-c f-j-c">
						<text class="f16-size f-w-b t-color-b">{{info.eyes.eyes_type}}</text>
						<text class="margin-t6 f-w-b t-color-c">眼型判断</text>
					</view>
				</view>
				<view class="padding-tb6 b-bottom-b">
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">眼睛高度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.eyes.eye_height}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">眼睛宽度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.eyes.eye_width}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">内眦角度数 (单位°)</text>
						<text class="f-w-b flex f-s-0">{{info.eyes.angulus_oculi_medialis}}</text>
					</view>
					<view class="padding-6"></view>
				</view>
				
				
				<view class="flex f-a-c f-j-s margin-t16">
					<view class="flex f-a-c">
						<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
						<text class="f16-size f-w-b">鼻子</text>
					</view>
					<view @click="showAdvice(info.nose.nose_type,info.nose.notice)" class="flex f-a-c">
						<text class="t-color-c f-w-500">查看建议</text>
						<image class="w-20 " src="@/static/images/right_icon.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="flex f-j-c margin-t15">
					<view class="face-line flex f-a-c f-j-c">
						<image class="w-100" src="@/static/images/bizi.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="bg-color-b b-radius-12 padding-tb12   margin-t16">
					<view class="flex f-c f-a-c f-j-c">
						<text class="f16-size f-w-b t-color-b">{{info.nose.nose_type}}</text>
						<text class="margin-t6 f-w-b t-color-c">鼻子判断</text>
					</view>
				</view>
				<view class="padding-tb6 b-bottom-b">
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">鼻翼宽度(单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.nose.nose_width}}</text>
					</view>
					<view class="padding-6"></view>
				</view>
				
				
				<view class="flex f-a-c f-j-s margin-t16">
					<view class="flex f-a-c">
						<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
						<text class="f16-size f-w-b">嘴唇</text>
					</view>
					<view @click="showAdvice(info.mouth.mouth_type,info.mouth.notice)" class="flex f-a-c">
						<text class="t-color-c f-w-500">查看建议</text>
						<image class="w-20 " src="@/static/images/right_icon.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="flex f-j-c margin-t15">
					<view class="face-line flex f-a-c f-j-c">
						<image class="w-100" src="@/static/images/zuichun.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="bg-color-b b-radius-12 padding-tb12   margin-t16">
					<view class="flex f-c f-a-c f-j-c">
						<text class="f16-size f-w-b t-color-b">{{info.mouth.mouth_type}}</text>
						<text class="margin-t6 f-w-b t-color-c">唇型判断</text>
					</view>
				</view>
				<view class="padding-tb6 b-bottom-b">
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">嘴唇高度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.mouth.mouth_height}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">嘴唇宽度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.mouth.mouth_width}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">嘴唇厚度 (上唇厚度＋下唇厚度)</text>
						<text class="f-w-b flex f-s-0">{{info.mouth.lip_thickness}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">嘴角弯曲度 (单位°)</text>
						<text class="f-w-b flex f-s-0">{{info.mouth.angulus_oris}}</text>
					</view>
					<view class="padding-6"></view>
				</view>
				
				
				<view class="flex f-a-c f-j-s margin-t16">
					<view class="flex f-a-c">
						<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
						<text class="f16-size f-w-b">下巴</text>
					</view>
					<view @click="showAdvice(info.jaw.jaw_type,info.jaw.notice)" class="flex f-a-c">
						<text class="t-color-c f-w-500">查看建议</text>
						<image class="w-20 " src="@/static/images/right_icon.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="flex f-j-c margin-t15">
					<view class="face-line flex f-a-c f-j-c">
						<image class="w-100" src="@/static/images/xiaba.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="bg-color-b b-radius-12 padding-tb12   margin-t16">
					<view class="flex f-c f-a-c f-j-c">
						<text class="f16-size f-w-b t-color-b">{{info.jaw.jaw_type}}</text>
						<text class="margin-t6 f-w-b t-color-c">下巴判断</text>
					</view>
				</view>
				<view class="padding-tb6 ">
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">下巴长度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.jaw.jaw_length}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">下巴宽度 (单位mm)</text>
						<text class="f-w-b flex f-s-0">{{info.jaw.jaw_width}}</text>
					</view>
					<view class="flex f-j-s f-a-c margin-t10">
						<text class="t-color-c">下巴角度 (单位°)</text>
						<text class="f-w-b flex f-s-0">{{info.jaw.jaw_angle}}</text>
					</view>
				</view>
				
			</view>
			
			<view :class="info.skin_age && info.skin_age.value?'':'skin-none'" class="bg-color-w b-radius-12 padding-20 margin-t20 p-r">
				<view v-if="info.skin_age && info.skin_age.value"></view>
				<view v-else class="wrap-report-btn">
					
					<button v-if="!isAuth" @authorizeprivatemessage="eventHandler" open-type="authorizePrivateMessage" :data-aweme-id="dyId">
						<view  class="bg-color-linear-b flex f-a-c f-j-c h-40 f16-size f-w-b t-color-w b-radius-30">点击查看皮肤报告</view>
					</button>
					<button v-else @pm="pmCallback" @error="pmError" open-type="privateMessage" :data-aweme-id="dyId">
						<view  class="bg-color-linear-b flex f-a-c f-j-c h-40 f16-size f-w-b t-color-w b-radius-30">点击联系顾问领取</view>
					</button>
					<!-- <view @click="pay" class="bg-color-linear-b flex f-a-c f-j-c h-40 f16-size f-w-b t-color-w b-radius-30">点击查看皮肤报告</view> -->
				</view>
				<view class="flex f-a-c f-j-c">
					<image class="w-24 margin-r8" src="@/static/images/face_fx.png" mode="widthFix"></image>
					<text class="f18-size f-w-b">皮肤分析</text>
				</view>
				<view class="c-none">
					<view class="flex f-a-c f-j-s margin-t16">
						<view class="flex f-a-c">
							<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
							<text class="f16-size f-w-b">干油性分析</text>
						</view>
					</view>
					<view class="bg-color-b b-radius-12 padding-tb12   margin-t16">
						<view class="flex f-c f-a-c f-j-c">
							<text class="f16-size f-w-b t-color-b">{{info.skin_type.value}}</text>
							<text class="margin-t6 f-w-b t-color-c">肤质分类</text>
						</view>
					</view>
					<view class="padding-tb6 ">
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">油光面积占比</text>
						</view>
						<view class="padding-l20">
							<view class="flex f-j-s f-a-c margin-t10">
								<text class="t-color-c">额头</text>
								<text class="f-w-b flex f-s-0">{{info.oily_intensity.t_zone.area*100}}%</text>
							</view>
							<view class="flex f-j-s f-a-c margin-t10">
								<text class="t-color-c">左脸颊</text>
								<text class="f-w-b flex f-s-0">{{info.oily_intensity.left_cheek.area*100}}%</text>
							</view>
							<view class="flex f-j-s f-a-c margin-t10">
								<text class="t-color-c">右脸颊</text>
								<text class="f-w-b flex f-s-0">{{info.oily_intensity.right_cheek.area*100}}%</text>
							</view>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">黑头个数</text>
							<text class="f-w-b flex f-s-0">{{info.blackhead_count}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">毛孔分析</text>
						</view>
						<view class="padding-l20">
							<view class="flex f-j-s f-a-c margin-t10">
								<text class="t-color-c">额头粗大毛孔数</text>
								<text class="f-w-b flex f-s-0">{{info.enlarged_pore_count.forehead_count}}</text>
							</view>
							<view class="flex f-j-s f-a-c margin-t10">
								<text class="t-color-c">左脸颊粗大毛孔数</text>
								<text class="f-w-b flex f-s-0">{{info.enlarged_pore_count.left_cheek_count}}</text>
							</view>
							<view class="flex f-j-s f-a-c margin-t10">
								<text class="t-color-c">右脸颊粗大毛孔数</text>
								<text class="f-w-b flex f-s-0">{{info.enlarged_pore_count.right_cheek_count}}</text>
							</view>
							<view class="flex f-j-s f-a-c margin-t10">
								<text class="t-color-c">下巴粗大毛孔数</text>
								<text class="f-w-b flex f-s-0">{{info.enlarged_pore_count.chin_count}}</text>
							</view>
						</view>
						<view class="padding-tb6"></view>
					</view>
				</view>
				<view class="b-bottom-b"></view>
				
				<view class="c-none">
					<view class="flex f-a-c f-j-s margin-t16">
						<view class="flex f-a-c">
							<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
							<text class="f16-size f-w-b">色素性分析</text>
						</view>
					</view>
					<view class="bg-color-b b-radius-12 padding-tb12 grid grid-c-3 margin-t16">
						<view class="flex f-c f-a-c f-j-c">
							<text class="f16-size f-w-b t-color-b" v-if="info.skinstone">{{info.skinstone}}</text>
							<text class="f16-size f-w-b t-color-b" v-else>{{skintone[info.skintone.value]}}</text>
							<text class="margin-t6 f-w-b t-color-c">东亚肤色分类</text>
						</view>
						<view class="flex f-c f-a-c f-j-c line-l line-r">
							<text class="f16-size f-w-b t-color-b" v-if="info.skintone_ita.ITA">{{skintone_ita[info.skintone_ita.skintone]}}</text>
							<text class="f16-size f-w-b t-color-b" v-else>{{info.skintone_ita}}</text>
							<text class="margin-t6 f-w-b t-color-c">ITA肤色分型</text>
						</view>
						<view class="flex f-c f-a-c f-j-c">
							<text class="f16-size f-w-b t-color-b" v-if="info.skin_hue_ha.HA">{{skin_hue_ha[info.skin_hue_ha.skin_hue]}}</text>
							<text class="f16-size f-w-b t-color-b" v-else>{{info.skin_hue_ha}}</text>
							<view class="flex f-c f-a-c f-j-c margin-t6">
								<text class=" f-w-b t-color-c">HA肤色</text>							
								<text class=" f-w-b t-color-c">色调分型</text>							
							</view>
						</view>
					</view>
					<view v-if="info.melanin" class="padding-tb6 ">
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">色素沉着面积占比</text>
							<text class="f-w-b flex f-s-0">{{info.melanin.brown_area*100}}%</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">色斑</text>
							<text class="f-w-b flex f-s-0">{{info.melanin.melanin_concentration}}</text>
						</view>
						<view class="padding-6"></view>
					</view>
				</view>	
				<view class="b-bottom-b"></view>
				
				<view class="c-none">
					<view class="flex f-a-c f-j-s margin-t16">
						<view class="flex f-a-c">
							<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
							<text class="f16-size f-w-b">痤疮分析</text>
						</view>
					</view>
					<view class="padding-tb6 ">
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">轻型丘疹</text>
							<text class="f-w-b flex f-s-0">{{info.acne}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">脓包型痤疮</text>
							<text class="f-w-b flex f-s-0">{{info.acne_pustule}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">痤疮结节</text>
							<text class="f-w-b flex f-s-0">{{info.acne_nodule}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">红痘印</text>
							<text class="f-w-b flex f-s-0">{{info.acne_mark}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">闭口粉刺</text>
							<text class="f-w-b flex f-s-0">{{info.closed_comedones}}</text>
						</view>
						<view class="padding-6"></view>
					</view>
				</view>
				<view class="b-bottom-b"></view>	
				
				<view class="c-none">
					<view class="flex f-a-c f-j-s margin-t16">
						<view class="flex f-a-c">
							<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
							<text class="f16-size f-w-b">衰老度分析</text>
						</view>
					</view>
					<view class="bg-color-b b-radius-12 padding-tb12   margin-t16">
						<view class="flex f-c f-a-c f-j-c">
							<text class="f16-size f-w-b t-color-b">{{info.skin_age.value}}</text>
							<text class="margin-t6 f-w-b t-color-c">肌龄</text>
						</view>
					</view>
					<view class="padding-tb6 ">
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">抬头纹</text>
							<text class="f-w-b flex f-s-0">{{info.forehead_wrinkle.value}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">法令纹</text>
							<text class="f-w-b flex f-s-0">{{info.nasolabial_fold.value}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">鱼尾纹</text>
							<text class="f-w-b flex f-s-0">{{info.crows_feet.value}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">眉间纹</text>
							<text class="f-w-b flex f-s-0">{{info.glabella_wrinkle.value}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">额头区域细纹</text>
							<text class="f-w-b flex f-s-0">{{info.fine_line.forehead_count}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">左眼部区域细纹</text>
							<text class="f-w-b flex f-s-0">{{info.fine_line.left_undereye_count}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">右眼部区域细纹</text>
							<text class="f-w-b flex f-s-0">{{info.fine_line.right_undereye_count}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">额头区域深纹</text>
							<text class="f-w-b flex f-s-0">{{info.wrinkle_count.forehead_count}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">左眼部区域深纹</text>
							<text class="f-w-b flex f-s-0">{{info.wrinkle_count.left_undereye_count}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">右眼部区域深纹</text>
							<text class="f-w-b flex f-s-0">{{info.wrinkle_count.right_undereye_count}}</text>
						</view>
						<view class="padding-6"></view>
					</view>
				</view>
				<view class="b-bottom-b"></view>
				
				<view class="c-none">
					<view class="flex f-a-c f-j-s margin-t16">
						<view class="flex f-a-c">
							<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
							<text class="f16-size f-w-b">眼部问题分析</text>
						</view>
					</view>
					<view class="padding-tb6 ">
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">眼袋</text>
							<text class="f-w-b flex f-s-0">{{info.eye_pouch.value}}</text>
						</view>
						<view class="flex f-j-s f-a-c margin-t10">
							<text class="t-color-c">黑眼圈</text>
							<text class="f-w-b flex f-s-0">{{info.dark_circle.value}}</text>
						</view>
						<view class="padding-6"></view>
					</view>	
				</view>
				<view class="b-bottom-b"></view>
				
				<view class="c-none">
					<view class="flex f-a-c f-j-s margin-t16">
						<view class="flex f-a-c">
							<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
							<text class="f16-size f-w-b">油光区域图</text>
						</view>
					</view>
					<view class="padding-tb20  flex f-j-c">
						<view class="img-line1 over-h">
							<image class="w100 h100 face" :src="info.image"  mode="aspectFill"></image>
							<image class="w100 h100 face1" :src="info.texture_enhanced_oily_area" mode="aspectFill"></image>
						</view>
						<view class="padding-6"></view>
					</view>	
				</view>
				<view class="b-bottom-b"></view>
				
				<view class="c-none">
					<view class="flex f-a-c f-j-s margin-t16">
						<view class="flex f-a-c">
							<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
							<text class="f16-size f-w-b">面部纹理图</text>
						</view>
					</view>
					<view class="padding-tb20  flex f-j-c">
						<view class="img-line1 over-h">
							<image class="w100 h100 face" :src="info.image"  mode="aspectFill"></image>
							<image class="w100 h100 face1" :src="info.texture_enhanced_lines" mode="aspectFill"></image>
						</view>
						<view class="padding-6"></view>
					</view>
				</view>	
				<view class="b-bottom-b"></view>
				
				<view class="c-none">
					<view class="flex f-a-c f-j-s margin-t16">
						<view class="flex f-a-c">
							<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
							<text class="f16-size f-w-b">面部黑头图</text>
						</view>
					</view>
					<view class="padding-tb20 flex f-j-c">
						<view class="img-line1 over-h">
							<image class="w100 h100 face" :src="info.image"  mode="aspectFill"></image>
							<image class="w100 h100 face1" :src="info.texture_enhanced_blackheads" mode="aspectFill"></image>
						</view>
						<view class="padding-6"></view>
					</view>
				</view>
				<view class="b-bottom-b"></view>
				
				<view class="c-none">
					<view class="flex f-a-c f-j-s margin-t16">
						<view class="flex f-a-c">
							<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
							<text class="f16-size f-w-b">面部毛孔图</text>
						</view>
					</view>
					<view class="padding-tb20  flex f-j-c">
						<view class="img-line1 over-h">
							<image class="w100 h100 face" :src="info.image"  mode="aspectFill"></image>
							<image class="w100 h100 face1" :src="info.texture_enhanced_pores" mode="aspectFill"></image>
						</view>
						<view class="padding-6"></view>
					</view>
				</view>
				<view class="b-bottom-b"></view>
				
				<view class="c-none">
					<view class="flex f-a-c f-j-s margin-t16">
						<view class="flex f-a-c">
							<image class="w-3 margin-r6" src="@/static/images/line_icon.png" mode="widthFix"></image>
							<text class="f16-size f-w-b">面部斑点图</text>
						</view>
					</view>
					<view class="margin-t20  flex f-j-c">
						<view  class="img-line1 over-h p-r">
							<image class="w100 h100 face" :src="info.image" mode="aspectFill"></image>
							<image class="w100 h100 face1" :src="info.roi_outline_map" mode="aspectFill"></image>
						</view>
					</view>
				</view>
				
				
			</view>	
			
			
		</view>
		<view class="padding-tb25"></view>
		
		<uni-popup ref="cAdvice" type="center">
			<view class="bg-color-w b-radius-12 padding-20 c-advice">
				<view class="flex f-j-c f18-size f-w-b">建议</view>
				<scroll-view scroll-y="true" style="max-height: 60vh;" class="margin-t10">
					<!-- <view class="margin-t12 f12-size t-color-c">{{title}}</view> -->
					<view v-for="(item,index) in advice" :key="index" class="flex margin-t2">
						<view class="dot flex f-s-0"></view>
						<text class="t-color-c f12-size">{{item[0]}}</text>
					</view>
				</scroll-view>
				
				<view @click="adviceClose()" class="flex f-a-c f-j-c b-radius-30 bg-color-linear-b t-color-w h-46 margin-t20">联系顾问获取更多建议</view>
			</view>
		</uni-popup>
		
		<uni-popup ref="auth" type="center">
			<view class="bg-color-w b-radius-12 padding-20 c-advice">
				<view class="flex f-j-c f18-size f-w-b">提示</view>
				<scroll-view scroll-y="true" style="max-height: 60vh;">
					<view class="margin-t12 f12-size t-color-c">请允许系统通过私信向您发送检测报告</view>
				</scroll-view>
				<view class="grid grid-c-2 grid-g12">
					<button class="w100"  @authorizeprivatemessage="eventHandler" open-type="authorizePrivateMessage" :data-aweme-id="dyId">
						<view class="flex f-a-c f-j-c b-radius-30 b-color-b t-color-b h-46 margin-t20">不同意</view>
					</button>
					
					<button class="w100"  @authorizeprivatemessage="eventHandler" open-type="authorizePrivateMessage" :data-aweme-id="dyId">
						<view  class="flex f-a-c f-j-c b-radius-30 bg-color-linear-b t-color-w h-46 margin-t20">同意</view>
					</button>
				</view>
			</view>
		</uni-popup>
		
		<uni-popup ref="guwen" type="center">
			<view class="bg-color-w b-radius-12 padding-20 c-advice">
				<view class="flex f-j-c f18-size f-w-b">{{isAgree ? '授权成功':'授权失败'}}</view>
				<view class="">
					<button class="w100" @pm="pmCallback" @error="pmError" open-type="privateMessage" :data-aweme-id="dyId">
						<view  class="flex f-a-c f-j-c b-radius-30 bg-color-linear-b t-color-w h-40 f16-size f-w-500 margin-t16">联系顾问</view>
					</button>
				</view>
			</view>
		</uni-popup>
		
	</view>
</template>
<style scoped>
@import '@/static/css/index/index.css';
</style>
<script>
	const API = require('@/utils/api/common.js').default;
	const $ = require('@/utils/api.js');
	let self = this;
	export default {
		components: {},
		data() {
			return {
				dyId: '61841694981',
				info: '',
				info1: '',
				show: true,
				skintone:{
					0:'透白',
					1:'白皙',
					2:'自然',
					3:'小麦',
					4:'黝黑/古铜'
				},
				skintone_ita: {
					0: '透白',
					1: '白皙',
					2: '自然中等肤色',
					3: '小麦色',
					4: '棕色',
					5: '深棕',
					6: '异常',
				},
				skin_hue_ha: {
					0: '偏黄',
					1:'中性',
					2:'偏红',
					3:'异常的色调'
				},
				advice: [],
				title: '',
				isAuth: false,
				has_auth: false,
				isAgree: false,
			};
		},
		onLoad: function(options) {
			self = this;
			this.init();
		},
		onShow() {
		},
		methods: {
			openAuth() {//弹窗提示私信授权
				this.has_auth = true;
				this.$refs.auth.open();
			},
			adviceClose() {
				this.$refs.cAdvice.close();
			},
			  eventHandler(e) {
				  const self = this;
				  this.isAuth = true;
			  	this.$refs.auth.close();
			      if (e.detail.errNo) {
					  this.isAgree = false;
					  this.$refs.guwen.open();
			        console.log("拉起主动私信授权失败", e.detail);
			      } else {
					  this.isAgree = true;
					  this.$refs.guwen.open();
			        console.log("拉起主动私信授权成功");
			  	  $.ajax({
			  	  	url: 'postAuthLog',
			  	  	data: {},
			  	  	method: 'POST',
			  	  	success(res) {
			  	  	}
			  	  })
			      }
			    },
			pmCallback(e) {
			    console.log("跳转私聊页成功", e.detail);
			  },
			  pmError(e) {
			    console.log("拉起私聊页失败", e.detail);
			  },
			pay() {
				$.ajax({
					url: 'preOrderTt',
					data: {},
					method: 'POST',
					success(res) {
						uni.requestPayment({
							orderInfo: {
							    order_id: res.order_id,
							    order_token: res.order_token,
							  },
							  service: 5,
						    // provider: 'wxpay',
							success: function (res) {
								console.log('success:' + JSON.stringify(res));
								self.skinCheck();
							},
							fail: function (err) {
								console.log('fail:' + JSON.stringify(err));
							}
						});
					}
				})
			},
			skinCheck() {
				const self = this;
				$.ajax({
					url: 'skinCheck',
					data: {
						image: this.info.image,
						id: this.info.id,
					},
					method: 'POST',
					success(res) {
						self.getDetail();
					}
				})
			},
			showAdvice(title,info) {
				this.title = title;
				this.advice = info;
				this.$refs.cAdvice.open();
			},
			im(res) {
				console.log(res);
			},
			submit() {
				const self = this;
				$.uploadimg({
					success(res) {
						self.test(res);
					}
				})
			},
			test(url) {
				const self = this;
				$.ajax({
					url: 'upload',
					loading: true,
					data: {
						image: url,
					},
					method: 'POST',
					success(res) {
						self.getDetail();
					}
				})
			},
			getDetail(type) {
				const self = this;
				let postData = {}
				if(type == 'test') {
					postData = {
						rand:3,
						id:205
					}
				}
				$.ajax({
					url: 'getDetail',
					data: postData,
					loading: true,
					loadingTetx: '生成报告中',
					method: 'GET',
					success(res) {
						self.info = res.data;
						self.info1 = res.best;
						self.has_auth = res.has_auth ? res.has_auth : false;
						if(type == 'test') {}else{
							self.show = true;
						}
					}
				})
			},
			init() {
				this.getDetail();
			},
		},
		computed: {},
		created() {
		},
		mounted() {},
		destroyed() {},
		onPullDownRefresh() {
		},
		onReachBottom() {
			
		}
	}
</script>